<template>
  <el-dialog title='修改岗位信息' :visible.sync='isShow' width='770px' @open="openDevInfo" :close-on-click-modal=false center
    @close='clearForm("this.postInfoBaseAdd")'>
    <div v-loading="loading">
      <!-- <el-steps finish-status="success" :active='active' align-center>
        <el-step title='岗位基本信息'></el-step>
        <el-step title='岗位生效信息'></el-step>
      </el-steps> -->
        <el-card>
          <el-form ref='postInfoBaseAdd' :model='postInfoBaseAdd' :rules="rulesBase" label-width="100px" size='mini'
            label-position='left'>
            <el-row :gutter="30">
              <el-col :span='12'>
                <el-form-item label='法人号:' prop='legalPersonNum'>
                  <el-input disabled v-model='postInfoBaseAdd.legalPersonNum'></el-input>
                </el-form-item>
              </el-col>
              <el-col :span='12'>
                <el-form-item label='法人名称:' prop='legalPersonName'>
                  <el-input disabled v-model='postInfoBaseAdd.legalPersonName'></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="30">
              <el-col :span='12'>
                <el-form-item label='应用编号 :' prop='appNum'>
                  <el-select disabled v-model="postInfoBaseAdd.appNum" placeholder="请选择应用">
                    <el-option v-for="item in appList" :key="item.value" :label="item.AppNum+'-'+item.AppName" :value="item.AppNum"
                      :disabled="item.disabled">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span='12'>
                <el-form-item label='岗位分类 :' prop='postClass'>
                  <el-select v-model="postInfoBaseAdd.postClass" placeholder="请选择岗位分类">
                    <el-option v-for="item in postSort" :key="item.value" :label="item.label" :value="item.value"
                      :disabled="item.disabled">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="30">
              <el-col :span='12'>
                <el-form-item label='岗位编号:' prop='postNum'>
                  <el-input disabled v-model='postInfoBaseAdd.postNum'></el-input>
                </el-form-item>
              </el-col>
              <el-col :span='12'>
                <el-form-item label='岗位名称:' prop='postName'>
                  <el-input v-model='postInfoBaseAdd.postName'></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span='12'>
                <el-form-item label='互斥岗位 :' prop='mutualExclPost'>
                  <el-select v-model="postInfoBaseAdd.mutualExclPost" multiple placeholder="请选择互斥岗位">
                    <el-option v-for="item in mutualExclPostList" :key="item.value" :label="item.name" :value="item.id"
                      :disabled="item.disabled">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="30">
              <el-col :span='12'>
                <el-form-item label="排序号:">
                  <el-col>
                    <el-input-number v-model="postInfoBaseAdd.sortNum" :min="1" :max="99"></el-input-number>
                  </el-col>
                </el-form-item>
              </el-col>
              <el-col :span='12'>
                <el-form-item label='岗位状态 :' prop='postStatys'>
                  <el-select v-model="postInfoBaseAdd.postStatys" placeholder="请选择岗位分类">
                    <el-option v-for="item in postStatueSort" :key="item.value" :label="item.label" :value="item.value"
                      :disabled="item.disabled">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="30">
              <el-col :span='12'>
                <el-form-item label="岗位生效日期:" prop="effeDate">
                  <el-date-picker v-model='postInfoBaseAdd.effeDate' disabled value-format="yyyyMMdd" type='date' placeholder='选择日期'></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span='12'>
                <el-form-item label="岗位失效日期:" prop="expiDate">
                  <el-date-picker v-model='postInfoBaseAdd.expiDate' type='date' value-format="yyyyMMdd" placeholder='选择日期'></el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-card>
        <el-row style="margin-top:10px;text-align:center">
          <el-button @click='sure' type='primary' size="mini">确定</el-button>
        </el-row>
    </div>
  </el-dialog>
</template>

<script>
  import request from "@/common/utils/request";
  import toolBox from "@/common/utils/toolBox";
  import appQuery from "@/message/shared/appquery";
  import mutexPost from "@/message/userManage/post/mutexpost-query";
  import postDetail from "@/message/userManage/post/post-detail";
  import postUpdate from "@/message/userManage/post/post-update";





  export default {
    data() {
      let postNameChek = (rule, value, callback) => {
      //校验岗位名称字符个数
      if (value != "") {
        let reg = value.length;
        if (reg<=20) {
          callback();
        } else {
          callback(new Error("请控制输入字符个数！"));
        }
      } else {
        callback();
      }
      };
      let expiDateChek = (rule, value, callback) => { //自定义表单验证 校验IP地址
      console.log(value);
      console.log(this.postInfoBaseAdd.effeDate);
        if (value != "") {
          if (value - this.postInfoBaseAdd.effeDate >= 0) {
            callback();
          } else {
            callback(new Error("失效日期必须大于生效日期"));
          }
        } else {
          callback();
        }
      };
      return {
        postStatueSort: [{
          "label": "1-启用",
          "value": "1"
        }, {
          "label": "0-停用",
          "value": "0"
        }],
        //   active:0,
        loading: false,
        appList: [], //应用分类下拉
        appStagingList: [], //应用分类，用于保存数据，做筛选
        postSort: [{
          "label": "01-非作业中心用户岗位",
          "value": "01"
        }, {
          "label": "02-作业中心用户岗位",
          "value": "02"
        }],
        postStatysSort: [], //岗位状态下拉
        mutualExclPostList: [], //互斥岗位下拉
        startTime: "", //服务开始时间
        endTime: "", //服务结束时间
        postInfoBaseAdd: {
          //设备基本信息表单数据
          appNum: "", //应用编号
          postNum: "", //岗位编号
          postName: "", //岗位名称
          postClass: "", //岗位类型
          mutualExclPost: [], //互斥岗位
          legalPersonNum: "", //法人号
          legalPersonName: "", //法人名称
          sortNum: "", //排序号
          postStatys: "",
          effeDate: "",
          expiDate: ""
        },
        rulesBase: {
          appNum: [{
            required: true,
            message: "请选择应用",
            trigger: "change"
          }],
          postNum: [{
            required: true,
            message: "请输入岗位编号 ",
            trigger: "blur"
          }],
          postName: [{
            required: true,
            message: "请输入岗位名称 ",
            trigger: "blur"
          },
          {
              validator: postNameChek,
              trigger: 'blur'
            }
          ],
          postClass: [{
            required: true,
            message: "请选择岗位类型 ",
            trigger: "blur"
          }],
          effeDate: [{
              required: true,
              message: "请选择岗位生效日期",
              trigger: "change"
            }
          ],
          expiDate: [{
              required: true,
              message: "请选择岗位失效日期",
              trigger: "change"
            },
            {
              validator: expiDateChek,
              trigger: "change"
            }
          ]
        },
      };
    },
    watch: {
      // 如果 `detailListRow` 发生改变，这个函数就会运行
      detailListRow: function (newQuestion, oldQuestion) {}
    },
    methods: {
      initList() {
        let resBody = new appQuery();
        resBody.data.UserNum = this.$store.getters.UserNum;
        request(resBody)
          .then(response => {
            this.appList = response.RspInfo.Result || [];
          })
          .catch(error => {
            this.loading = false;
            console.error("查询错误", error);
          });

          this.mutualExclPostList = [];
          let resBody1 = new mutexPost();
          resBody1.data.AppNum = this.option.appNum;
          resBody1.data.PostNum = this.option.postNum;
          request(resBody1)
            .then(response => {
              if (response.SYS_HEAD.ReturnCode == "000000" || response.SYS_HEAD.ReturnCode == "CID001") {
                this.mutualExclPostList = response.RspInfo.Result || [];
              } else {
                this.$message({
                  type: "error",
                  message: "加载失败!互斥机构:"+response.SYS_HEAD.ReturnMessage
                });
              }
            })
            .catch(error => {
              this.loading = false;
              console.error("查询错误", error);
            });
      },
      openDevInfo() {
        this.loading = true;
        this.initList();
        this.queryDetailList();
        if (this.$refs["postInfoBaseAdd"] != undefined) {
          this.$refs["postInfoBaseAdd"].clearValidate(); //清楚表单验证
          this.$refs["postInfoBaseAdd"].resetFields();
        }
      },
      // back() {
      //   if (this.option.active >= 1) {
      //     this.active--;
      //   }
      // },
      // nextClick() {
      //   if (this.option.active == 0) {
      //     this.$refs["postInfoBaseAdd"].validate(valid => {
      //       if (valid) {
      //         this.active++;
      //         this.$refs["postInfoBaseAdd"].clearValidate();
      //       }
      //     });
      //   }
      // },
      sure() {
        this.$refs["postInfoBaseAdd"].validate(valid => {
          if (valid) {
            this.loading=true;
            let resBody = new postUpdate();
            resBody.data.AppNum = this.postInfoBaseAdd.appNum;
            resBody.data.PostNum = this.postInfoBaseAdd.postNum;
            resBody.data.PostName = this.postInfoBaseAdd.postName;
            resBody.data.SortNum = this.postInfoBaseAdd.sortNum;
            resBody.data.EffeDate = this.postInfoBaseAdd.effeDate;
            resBody.data.ExpiDate = this.postInfoBaseAdd.expiDate;
            resBody.data.LegalPersonNum = this.postInfoBaseAdd.legalPersonNum;
            resBody.data.PostClass = this.postInfoBaseAdd.postClass;
            resBody.data.PostStatus = this.postInfoBaseAdd.postStatys;
            resBody.data.MutualExclPost = this.postInfoBaseAdd.mutualExclPost.join(",");
            request(resBody)
              .then(response => {
                this.loading = false;
                if (response.SYS_HEAD.ReturnCode === "000000") {
                  this.$message({
                    type: "success",
                    message: "修改成功!"
                  });
                  this.isShow = false;
                  this.$refs["postInfoBaseAdd"].clearValidate();
                  this.$emit("refreshTable");
                } else {
                  this.$message({
                    type: "error",
                    message: response.SYS_HEAD.ReturnMessage
                  });
                }
              })
              .catch(error => {
                console.log(error);
              });
          }
        });
      },
      queryDetailList() {
        let resBody = new postDetail();
        resBody.data.AppNum = this.option.appNum;
        resBody.data.PostNum = this.option.postNum;
        request(resBody)
          .then(response => {
            if (response.SYS_HEAD.ReturnCode === "000000") {
            let dataInfo =response.RspInfo.pageList[0];
            this.postInfoBaseAdd.appNum = dataInfo.appnum;
            this.postInfoBaseAdd.postNum = dataInfo.postnum;
            this.postInfoBaseAdd.postName = dataInfo.postname;
            this.postInfoBaseAdd.sortNum = dataInfo.sortnum;
            this.postInfoBaseAdd.effeDate = dataInfo.effedate;
            this.postInfoBaseAdd.expiDate = dataInfo.expidate;
            this.postInfoBaseAdd.legalPersonNum = dataInfo.legalpersonnum;
            this.postInfoBaseAdd.legalPersonName = this.$store.getters.LegalPersonName;
            this.postInfoBaseAdd.postClass = dataInfo.postclass;
            this.postInfoBaseAdd.postStatys = dataInfo.poststatus;
            if( dataInfo.mutualexclpost && dataInfo.mutualexclpost != ''){
              let list =(dataInfo.mutualexclpost ).split(",");
              this.postInfoBaseAdd.mutualExclPost =list;
            }
            this.loading = false;
            }
          })
          .catch(error => {
            this.loading = false;
            console.log(error);
          });
      },
      clearForm(firstList, ...lists) {
        // 重置表单数据
        if (this.$refs["postInfoBaseAdd"] != undefined) {
          this.$refs["postInfoBaseAdd"].clearValidate(); //清楚表单验证
          this.$refs["postInfoBaseAdd"].resetFields();
        }
      }
    },
    props: {
      option: Object
    },
    computed: {
      isShow: {
        get: function () {
          return this.option.isShow;
        },
        set: function (newValue) {
          this.option.isShow = newValue;
        }
      },
      // active: {
      //   get: function () {
      //     return this.option.active;
      //   },
      //   set: function (newValue) {
      //     this.option.active = newValue;
      //   }
      // }
    }
  };

</script>

<style lang="scss" scoped>
  .el-dialog .el-dialog__body {
    padding: 20px 27px 20px !important;
  }

  .content {
    display: flex;
    flex-direction: column;

    .footer {
      display: flex;
      justify-content: center;
      margin-top: 20px;

      .el-card {
        overflow: inherit;
      }
    }
  }

</style>
